<template>
  <div @click="useJudgeAction">
    <Header/>
    <!-- <h2>在线时间：{{onlineTime}}</h2> -->
    <router-view></router-view>
    <Footer />
  </div>
</template>

<script>
export default {
  name: 'app',
  data() {
    return {
      lTime: new Date().getTime(), // 最后一次点击的时间
      cTime: new Date().getTime(), //当前时间
      intervalTime: 60000,
      timer: null,
      onlineTime:0,
      onlineTImer:null
    }
  },
  mounted() {
    this.useJudgeAction()
  },
  watch: {
    '$store.state.userName'(n, o) {
      let vm = this
      if (n) {
        vm.useJudgeAction()
      }
    },
  },
  methods: {
    useJudgeAction() {
      let vm = this
      clearInterval(this.timer)
      let hasLogin =
        this.$store.userName || this.storage.getLocal('17003334_user')

      // if (hasLogin) {
      //   this.lTime = new Date().getTime() //当界面被点击更新点击时间
      //   this.timer = setInterval(this.tTime, this.intervalTime) // 秒检查操作
      // }
    },
    tTime() {
      clearInterval(this.timer)
      this.cTime = new Date().getTime()
      // 超时则更改为未登录状态
      if (this.cTime - this.lTime >= this.intervalTime) {
        this.storage.removeLocal('17003334_user')
        this.$store.commit('loginMut', '')

        this.$confirm('1分钟时间未操作，登陆已失效，请重新登陆?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            this.$router.push('/login')
          })
          .catch(() => {})
      }
    },
  },
}
</script>

<style lang='scss'>
// @import './assets/style/reset.css'
// @import './assets/style/index.scss'

* {
  margin: 0;
  padding: 0;
}
#app {
  .app_content {
    padding-top: 40px;
    min-height: 64vh;
    width: 1336px;
    margin: 0 50%;
    transform: translate(-50%);
  }
}
.el-row {
  margin-bottom: 10px;
  &:last-child {
    margin-bottom: 0;
  }
}
</style>
